const { merge } = require('webpack-merge');
const TerserPlugin = require('terser-webpack-plugin');
const WebpackParallelUglifyPlugin = require('webpack-parallel-uglify-plugin');
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
const CircularDependencyPlugin = require('circular-dependency-plugin');

const baseConfig = require('./base.config');
const { resolveApp } = require('../utils');

module.exports = merge(baseConfig, {
  entry: resolveApp('src/app/main'),
  devtool: 'source-map',
  plugins: [
    // new WebpackParallelUglifyPlugin({
    //   // 传递给 UglifyJS的参数如下：
    //   uglifyJS: {
    //     output: {
    //       /*
    //      是否输出可读性较强的代码，即会保留空格和制表符，默认为输出，为了达到更好的压缩效果，
    //      可以设置为false
    //     */
    //       beautify: false,
    //       /*
    //      是否保留代码中的注释，默认为保留，为了达到更好的压缩效果，可以设置为false
    //     */
    //       comments: false,
    //     },
    //     compress: {
    //       /*
    //      是否删除代码中所有的console语句，默认为不删除，开启后，会删除所有的console语句
    //     */
    //       drop_console: true,
    //       /*
    //      是否内嵌虽然已经定义了，但是只用到一次的变量，比如将 var x = 1; y = x, 转换成 y = 5, 默认为不
    //      转换，为了达到更好的压缩效果，可以设置为false
    //     */
    //       collapse_vars: true,
    //       /*
    //      是否提取出现了多次但是没有定义成变量去引用的静态值，比如将 x = 'xxx'; y = 'xxx'  转换成
    //      var a = 'xxxx'; x = a; y = a; 默认为不转换，为了达到更好的压缩效果，可以设置为false
    //     */
    //       reduce_vars: true,
    //     },
    //   },
    // }),
  ],
  optimization: {
    /**
     * 告知 webpack 使用 TerserPlugin 或其它在 optimization.minimizer 定义的插件压缩 bundle。
     */
    minimize: true,
    minimizer: [
      // This is only used in production mode
      new TerserPlugin({
        parallel: true,
        terserOptions: {
          parse: {
            // We want terser to parse ecma 8 code. However, we don't want it
            // to apply any minification steps that turns valid ecma 5 code
            // into invalid ecma 5 code. This is why the 'compress' and 'output'
            // sections only apply transformations that are ecma 5 safe
            // https://github.com/facebook/create-react-app/pull/4234
            ecma: 8,
          },
          compress: {
            ecma: 5,
            warnings: false,
            // Disabled because of an issue with Uglify breaking seemingly valid code:
            // https://github.com/facebook/create-react-app/issues/2376
            // Pending further investigation:
            // https://github.com/mishoo/UglifyJS2/issues/2011
            comparisons: false,
            // Disabled because of an issue with Terser breaking valid code:
            // https://github.com/facebook/create-react-app/issues/5250
            // Pending further investigation:
            // https://github.com/terser-js/terser/issues/120
            inline: 2,
          },
          mangle: {
            safari10: true,
          },
          // Added for profiling in devtools
          keep_classnames: true,
          keep_fnames: true,
          output: {
            ecma: 5,
            comments: false,
            // Turned on because emoji and regex is not minified properly using default
            // https://github.com/facebook/create-react-app/issues/2488
            ascii_only: true,
          },
          sourceMap: true,
        },
      }),
      // This is only used in production mode
      new CssMinimizerPlugin(),
    ],
    /**
     * 使用 optimization.emitOnErrors 在编译时每当有错误时，就会 emit asset。这样可以确保出错的 asset 被 emit 出来。关键错误会被 emit 到生成的代码中，并会在运行时报错。
     */
    emitOnErrors: true,
  },
});
